﻿<UserControl
    x:Class="Icinetic.FeedCategorySample.MenuSnappedControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Icinetic.FeedCategorySample"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:commonbase="using:Icinetic.FeedCategorySample.Common.Base"
    xmlns:common="using:Icinetic.FeedCategorySample.Common"
    mc:Ignorable="d"
    d:DesignHeight="300"
    d:DesignWidth="400">
    
    <UserControl.Resources>
        <CollectionViewSource
                    x:Name="categoryitemsViewSource"
                    Source="{Binding CategoryList}"
                    IsSourceGrouped="true"
                    ItemsPath="Articles"
                    />
    </UserControl.Resources>
    
    <Grid x:Name="itemListScrollViewer"
            AutomationProperties.AutomationId="ListScrollViewer"
            VerticalAlignment="Stretch">
        <Grid.RowDefinitions>
            <RowDefinition Height="45"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
        </Grid>
        <SemanticZoom x:Name="snapView" Grid.Row="1" IsZoomedInViewActive="{Binding IsZoomedInViewActive, ElementName=LandscapeView}">
            <SemanticZoom.ZoomedOutView>
                <!-- Vertical scrolling list only used when snapped -->
                <ListView
                    x:Name="groupListView"
                    AutomationProperties.AutomationId="ItemListView"
                    AutomationProperties.Name="Grouped Items"
                    Margin="0,-10,0,0"
                    Padding="10,0,0,60"
                    ItemsSource="{Binding ElementName=categoryitemsViewSource, Path=View.CollectionGroups}"
                    SelectionMode="None"
                    IsSwipeEnabled="false"
                    IsItemClickEnabled="True">
                    <ListView.ItemTemplate>
                        <DataTemplate>
                            <Grid DataContext="{Binding Group}" Background="{Binding Color}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Margin="45,6,0,0" Height="100" Width="200">
                                <TextBlock Text="{Binding Title}" Style="{StaticResource MenuTitleStyle}" Foreground="White" VerticalAlignment="Center" HorizontalAlignment="Center"/>
                            </Grid>
                        </DataTemplate>
                    </ListView.ItemTemplate>
                </ListView>
            </SemanticZoom.ZoomedOutView>
            <SemanticZoom.ZoomedInView>
                <!-- Vertical scrolling list only used when snapped -->
                <ListView
                    x:Name="itemListView"
                    AutomationProperties.AutomationId="ItemListView"
                    AutomationProperties.Name="Grouped Items"
                    Margin="0,-10,0,0"
                    Padding="10,0,0,60"
                    ItemsSource="{Binding Source={StaticResource categoryitemsViewSource}}"
                    ItemTemplate="{StaticResource RssSnapedTemplate}"
                    SelectionMode="None"
                    IsSwipeEnabled="false"
                    IsItemClickEnabled="True"
                    ItemClick="ItemView_ItemClick">
                    <ListView.GroupStyle>
                        <GroupStyle>
                            <GroupStyle.HeaderTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding Title}" Margin="3,10,10,10" Style="{StaticResource TitleItemPageStyle}"/>
                                </DataTemplate>
                            </GroupStyle.HeaderTemplate>
                        </GroupStyle>
                    </ListView.GroupStyle>
                </ListView>
            </SemanticZoom.ZoomedInView>
        </SemanticZoom>
    </Grid>
</UserControl>
